<template>
	<view class="" v-if="practiceNav.length">
		<u-navbar :is-back="true" :border-bottom="false" height="46" :title="practiceNav[0].name" title-color="#333"
		 :title-size="36" :title-bold="true">
		</u-navbar>
		<u-tabs :list="practiceList" :is-scroll="false" :current="current" @change="change" bar-width="92" :active-item-style="{marginBottom:'10rpx'}"
		 active-color="#c40200" :bar-style="{backgroundColor:'#c40200',height:'5rpx',borderRadius: '5rpx'}"></u-tabs>
		<u-gap height="20" bg-color="#F7F7F7"></u-gap>
		<common-list :atlascont="practiceconList" @child-msg="getChildMsg"></common-list>
		<u-loadmore v-if="loadshow" :status="status" :icon-type="iconType" :load-text="loadText" style="margin-top: 30rpx;" />
	</view>
</template>

<script>
	import CommonList from "@/components/common/CommonList.vue"
	export default {
		data() {
			return {
				practiceList: [],
				practiceNav: [],
				practiceconList: [],
				current: 0,
				status: 'nomore',
				iconType: 'flower',
				loadText: {
					loadmore: '轻轻上拉',
					loading: '努力加载中',
					nomore: '实在没有了'
				},
				loadshow: false,
				pagesize: 20,
			}
		},
		onLoad(options) {
			this.PraNav(options.id)
		},
		onReachBottom() {
			this.pagesize = this.pagesize + 20
			this.PraNavlist(this.practiceList[this.current].id)
		},
		methods: {
			change(index) {
				this.loadshow=false;
				this.current = index;
				this.PraNavlist(this.practiceList[index].id)
			},
			async PraNav(id) {
				let params = {
					cmd: 'nEdu_list_proc',
					para: {

					}
				}
				const res = await this.$u.api.PraNav(params)
				this.practiceList = res.Data.Datas1.filter(item => item.pid == id)
				this.practiceNav = res.Data.Datas1.filter(item => item.id == id)
				this.PraNavlist(this.practiceList[0].id)

			},
			async PraNavlist(id) {
				let params = {
					cmd: 'nEdu_list_proc',
					para: {
						"pageindex": 1,
						"pagesize": this.pagesize,
						colid: id
					}
				}
				const res = await this.$u.api.PraNav(params)
				this.practiceconList = res.Data.Data
				this.loadshow = this.practiceconList.length > 0 ? false : true
				if (this.practiceconList.length < this.pagesize-20) {
					this.loadshow = true
				}
				for (var value of this.practiceconList.values()) {
					value.wjlx = this.baseUrl + value.wjlx
				}
			},
			getChildMsg(msg) {
				// console.log(msg)
				this.$u.route('/pages/HomeLnner/PracticeDetails/PracticeDetails', {
					id: msg
				});
			}
		},
		components: {
			"common-list": CommonList,
		}
	}
</script>

<style>
</style>
